<style lang="less" scoped>
.login-box{
  display: flex;
  flex: 1;
  height: 100%;
  flex-direction: column;
  align-items: center;
  background: #f0f0f0;
}
.login-box_info{
  width: 100%;
  height: 214px;
  background: #ccc;
  display: flex;
  flex-direction: column;
  justify-content: center;
  -ms-flex-pack: center;
  align-items: center;
}
.info-avatar{
  width: 81px;
  height: 81px;
  margin-top: -27px;
  
}
.info-avatar>img{
  width: 100%;
  height: 100%;
  border-radius: 100rpx
}
.info-store{
  width: 165px;
  height: 31px;
  line-height: 1px;
  border-radius: 30rpx;
  display: flex;
  margin-top: 21px;
  box-sizing: border-box;
  border:1rpx solid #7A1634;
}
.info-store>input{
	flex: 1;
	font-size: 14px;
}
.login_box_con{
  position: fixed;
  top: 30%;
  left: 0rpx;
  right: 0rpx;
  box-sizing: border-box;
  padding: 0 20rpx;
  z-index: 10;
}
.con-box{
  width: 100%;
  height: 300rpx;
  background: #fff;
  border: 1rpx solid #e5e5e5;
  padding: 50rpx 30rpx 30rpx;
  display: flex;
  box-sizing: border-box;
  flex-direction: column;
  border-radius: 10rpx;
}
.con-box_input{
  width: 100%;
  height: 80rpx;
  line-height: 80rpx;
  display: flex;
  border-bottom: 1rpx solid #7A1634;
}
.con-box_input>input{
  width: 100%;
  display: block;
  height: 100%;
  line-height: 80rpx;
	flex: 1;
	font-size: 16px
}
.m-t{
  margin-top: 40rpx;
}
.code{
	font-size: 14px;
  color: #7A1634;
}
.login-btn{
  width: 100%;
  height: 46px;
  line-height: 46px;
  border-radius: 30rpx;
  background: #e5e5e5;
  margin-top: 17px;
  font-size: 16px;
  color: #fff;
  outline: none;
  border: none;
  text-align: center;
}
.current-btn{
  background: #7A1634;
}
</style>
<template>
  <div class="login-box">
  <div class="login-box_info">
    <div class="info-avatar">
      <img mode='widthFix' src="http://img2.imgtn.bdimg.com/it/u=425954437,8809201&fm=27&gp=0.jpg" />
    </div>
    <div class="info-store">
      <input type='number' placeholder='请输入店铺码' v-model="storeCode"/>
    </div>
  </div>
  <div class="login_box_con">
    <div class="con-box">
      <div class="con-box_input">
        <input type="number" placeholder='请输入手机号' maxlength='11' v-model="loginName"/>
      </div> 
      <div class="con-box_input m-t">
        <input type="number" placeholder='请输入验证码' v-model="loginCode"/>
        <div class="code">获取验证码</div>
      </div> 
    </div>
    <div class="login-btn" :class="{'current-btn': loginName !='' && storeCode !=''}">绑定并进入店铺</div>
    
  </div>
</div>
</template>

<script>
export default {
	title: '登录',
	data () {
		return {
			storeCode:'',
			loginName:'',
			loginCode:'',
			code: '', // 微信的临时登录凭证
			userInfo: {}, // 用户的当前信息体
			status: '', // 登录状态
			loadMore: 0,
		}
	}

	
		
		
	
	

}
</script>